Formulario de comentarios incrustado

Ya sé que a estas alturas todo el mundo tiene el nuevo formulario de comentarios añadido al blog pero no dejan de preguntarme la forma de personalizarlo así que lo mejor será empezar por el principio.

Pero antes tengo que añadir que he visto muchos blogs donde explican este proceso pero... unos porque son en otro idioma y otros porque no aportan toda la información necesaria llego a la conclusión que ninguna explicación es tan completa como la que ofrece Vagabundia.

Esta explicación la he extraído de dos amplias entradas suyas, quiero decir con esto que encontraréis una información más detallada y completa en:

Blogger Fenix: el formulario de comentarios
Solución a algunos problemas con los formularios de comentarios

¿Comenzamos?
Si tu plantilla no ha tenido demasiadas modificaciones no tendrás ningún problema siguiendo estos pasos. Accedemos al blog por Blogger Draft y nos dirigimos a Configuración/Comentarios hasta llegar a:

Como muestra la imagen marcamos la casilla de "Entrada incrustada a continuación" guardamos los cambios y comprobamos que el nuevo editor aparece en el blog.

Bien, hasta ahí llegamos todos ¿Pero qué ocurre si el editor no aparece? comienza el primer problema que debemos solventar y con el que yo misma me encontré.

J.Miur nos da la solución, y es la siguiente. Nos dirigimos a Plantilla de diseño/Edición HTML y marcamos expandir la plantilla.

Tenemos que añadir dos códigos pero OJO, hay plantillas que por defecto ya tienen el primero de ellos si es así nos bastará con añadir sólo el segundo.

Para añadir el primero buscaremos:

<:/b:includable>
Aquí añadimos el 1º código
<:b:includable id='backlinkDeleteIcon' var='backlink'>

Este es el 1º Código que añadimos

<b:includable id='comment-form' var='post'>
  <div class='comment-form'>
    <a name='comment-form'/>
    <h3><data:postCommentMsg/></h3>
    <p><data:blogCommentMessage/></p>
    <iframe allowtransparency='true' expr:src='data:post.commentFormIframeSrc' frameborder='0' height='275' id='comment-editor' scrolling='auto' width='100%'/>
  </div>
</b:includable>

Después buscamos el siguiente código:

<p class='comment-footer'>
<a expr:href='data:post.addCommentUrl' expr:onclick='data:post.addCommentOnclick'>
<data:postCommentMsg/>
</a>
</p>

Y lo sustituimos por este otro:

<p class='comment-footer'>
        <b:if cond='data:post.embedCommentForm'>
          <b:include data='post' name='comment-form'/>
        <b:else/>
          <b:if cond='data:post.allowComments'>
            <a expr:href='data:post.addCommentUrl' expr:onclick='data:post.addCommentOnclick'><data:postCommentMsg/></a>
          </b:if>
        </b:if>
</p>

Al no ser todas las plantillas iguales puede hacerse complicado ubicar el segundo código que sustituimos, si no lo encontramos en lugar de buscar:

<p class='comment-footer'>
<a expr:href='data:post.addCommentUrl' expr:onclick='data:post.addCommentOnclick'>
<data:postCommentMsg/>
</a>
</p>

buscaremos lo siguiente:

<a expr:href='data:post.addCommentUrl'
expr:onclick='data:post.addCommentOnclick'>

Pero OJO encontraremos este mismo código dos veces, uno ubicado en

<b:includable id='backlinks' var='post'>

y otro en

<b:includable id='comments' var='post'>

El que debemos sustituir se encuentra dentro del siguiente código que es de los comentarios.

<b:includable id='comments' var='post'>

El confundirse es fácil al menos yo me confundí y arreglándolo añadí el código dos veces (yo también meto la pata de vez en cuando) pero por suerte hay ángeles que tienen blog y uno de ellos se hace llamar J.Miur

En la mayoría de plantillas que nos surgen estos problemas son plantillas adaptadas, pues bien, si con todas estas explicaciones el editor se resiste a salir no hay que perder la calma y podemos probar otra opción. Marcamos para expandir la plantilla y buscamos la siguiente línea

<b:include data='post' name='comments' />

Justo después añadimos lo siguiente:

<b:include data='post' name='comment-form'/>

Comprobemos ahora el resultado una vez guardados los cambios.